<!-- navigationBar组件 -->
<template>
	<view class="navigation-bar-comp" id="navigation-bar-comp">
		<view class='flex commonHead'
			:style="[{'top':myProperty.top||'0px','color':myProperty.color?myProperty.color:'#000'},{'background':myProperty.bg_color?myProperty.bg_color:'white'},{'height':headHeight.titleHeight*2+'rpx'}]">
			<view class='commonHead-wrap flex'>
				<view class='commonHead_left'>

					<view class="home-icon-box" v-if="showBackHome" @click="backHomeHandle">
						<u-icon size="44rpx" name="home" color="#000"></u-icon>
					</view>
					<template v-else>
						<view v-if="myProperty.flag==1" class='commonHead_left_back' @click='commonHead_left_back'>
							<image class="back" src="../../static/images/blackBack.png"></image>
						</view>

						<view v-if="myProperty.flag==3" class='commonHead_left_back' @click='commonHeadToMe'>
							<image class="back" src="../../static/images/blackBack.png"></image>
						</view>
						<view v-if="myProperty.flag==4" class='commonHead_left_back' @click='commonHead_left_back'>
							<image class="back" src="../../static/images/whiteback.png"></image>
						</view>
					</template>

				</view>
				<view class='commonHead_right flex'>
					<view class='commonHead_right_text line1'>{{myProperty.name?myProperty.name:""}}</view>
				</view>
			</view>
		</view>
		<view v-if="myProperty.hasEntity" class="placeholder-entity"
			:style="{'height':headHeight.titleHeight*2+'rpx','background-color':myProperty.bg_color?myProperty.bg_color:'white'}">
		</view>
	</view>
</template>

<script>
	var app = getApp();
	export default {
		props: {
			myProperty: {
				type: Object,
				value: {
					"bg_color": "white",
					"color": "#000",
					"flag": 1,
					"name": "我是标题",
					"hasEntity": false,
				},
				isUrl: {
					type: String,
					value: '1'
				},
			},
			showBackHome: {
				type: Boolean,
				value: false
			},
			commonHeadHeight: {
				type: Object,
				value: {}
			},
			emitBackEvent: {
				type: Boolean,
				value: false
			},
		},
		data() {
			return {
				headHeight: {}
			}
		},
		created: function() {
			var that = this
			console.log(app.globalData.topHeight)
			that.headHeight.titleHeight = app.globalData.topHeight
		},
		methods: {
			backHomeHandle() {
				if (this.emitBackEvent) {
					this.$emit('backEvent')
				} else {
					uni.reLaunch({
						url: '/pages/sclList/sclList'
					})
				}
			},
			commonHead_left_back() {
				console.log('---------commonHead_left_back')
				if (this.emitBackEvent) {
					this.$emit('backEvent')
				} else if (getCurrentPages().length > 1) {
					uni.navigateBack()
				} else {
					uni.reLaunch({
						url: '/pages/sclList/sclList'
					})
				}
			},
			commonHeadToMe() {
				console.log(11111)
				uni.reLaunch({
					url: '/pages/me/me'
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	@import "./navigationBar.css";

	.navigation-bar-comp {
		.commonHead {
			z-index: 9999;
			font-weight: 500;
		}

		.placeholder-entity {
			// 这里什么都没有...
		}

		.home-icon-box {
			width: 64rpx;
			height: 64rpx;
			margin-left: 24rpx;

			display: flex;
			align-items: center;
			justify-content: center;

			border-radius: 46rpx;


			border: 1rpx solid #333;
		}
	}
</style>